<template>
  <div>
    当前count值为:{{ $store.state.count }}
    <el-button type="primary" @click="add" icon="el-icon-plus" size="small">增加</el-button>
    <el-button type="primary" @click="addN()" icon="el-icon-plus" size="small">增加N</el-button>
    <el-button type="primary" @click="handleAddAsync()" icon="el-icon-plus" size="small">增加 async</el-button>
  </div>
</template>

<script>
import {mapActions} from 'vuex'

export default {
  name: "Addition",
  methods: {
    add() {
      this.$store.commit('add')
    },
    addN(state, step) {
      this.$store.commit('addN')
    },
    ...mapActions(['addAsync']),

    handleAddAsync() {   // 也可以省略自定义的handleAddAsync，点击事件直接写成同名的addAsync
      this.addAsync()
    }

  },

}
</script>

<style scoped>
.el-button {
  margin: 5px;
}
</style>
